<table mat-table [dataSource]="investList">

  <ng-container matColumnDef="name">
    <th mat-header-cell *matHeaderCellDef> 股票名称 </th>
    <td mat-cell *matCellDef="let element"> {{element.name}} </td>
  </ng-container>

  <ng-container matColumnDef="code">
    <th mat-header-cell *matHeaderCellDef> 股票代码 </th>
    <td mat-cell *matCellDef="let element"> {{element.code}} </td>
  </ng-container>

  <ng-container matColumnDef="price">
    <th mat-header-cell *matHeaderCellDef> 买入价格 </th>
    <td mat-cell *matCellDef="let element"> {{element.price | number:'1.2-2'}} </td>
  </ng-container>

  <ng-container matColumnDef="selloutPrice">
    <th mat-header-cell *matHeaderCellDef> 卖出价格 </th>
    <td mat-cell *matCellDef="let element"> {{element.selloutPrice | number:'1.2-2'}} </td>
  </ng-container>

  <ng-container matColumnDef="selloutVolume">
    <th mat-header-cell *matHeaderCellDef> 卖出股数 </th>
    <td mat-cell *matCellDef="let element"> {{element.selloutVolume}} </td>
  </ng-container>

  <ng-container matColumnDef="selloutAmount">
    <th mat-header-cell *matHeaderCellDef> 成交金额（元） </th>
    <td mat-cell *matCellDef="let element"> {{element.selloutAmount}} </td>
  </ng-container>

  <ng-container matColumnDef="profit">
    <th mat-header-cell *matHeaderCellDef> 收益（元） </th>
    <td mat-cell *matCellDef="let element">
      <span *ngIf="element.profit > 0" class="red font-weight-bold">{{element.profit}}</span>
      <span *ngIf="element.profit <= 0" class="green font-weight-bold">{{element.profit}}</span>
    </td>
  </ng-container>

  <ng-container matColumnDef="profitRate">
    <th mat-header-cell *matHeaderCellDef> 收益率 </th>
    <td mat-cell *matCellDef="let element">
      <span *ngIf="element.profit > 0" class="red font-weight-bold">{{element.profit / element.selloutAmount * 100 | number:'1.2-2'}}%</span>
      <span *ngIf="element.profit <= 0" class="green font-weight-bold">{{element.profit / element.selloutAmount * 100 | number:'1.2-2'}}%</span>
    </td>
  </ng-container>

  <ng-container matColumnDef="selloutTime">
    <th mat-header-cell *matHeaderCellDef> 卖出时间 </th>
    <td mat-cell *matCellDef="let element"> {{element.selloutTime | date: 'yyyy-MM-dd HH:mm'}} </td>
  </ng-container>

  <tr mat-header-row *matHeaderRowDef="dataColumns"></tr>
  <tr mat-row *matRowDef="let row; columns: dataColumns;"></tr>
</table>
